import { BFFormParseProps } from '@/components/bf-form-parse/src/bf-form.parse'
import { BFTableProps } from '@/components/bf-table/src/bf-table'
import { ButtonProps } from 'naive-ui'
import { h, reactive, ref } from 'vue'

export type BFCurdOperaBtn = {
  text: string
  opera: string
  pos?: 'left' | 'right'
  action?: Function
  show?: (data?: any) => boolean
  btnProps: ButtonProps
}

export interface BFCurdProps {
  operaBtns: {
    toolRow?: BFCurdOperaBtn[]
    modalConfirm?: BFCurdOperaBtn
    modalCancel?: BFCurdOperaBtn
    tableActionColumn?: BFCurdOperaBtn[]
    drawerFooter: BFCurdOperaBtn[]
  }
  table: BFTableProps
  form?: BFFormParseProps
  r?: (page: number, size: number) => Promise<{ list: any[]; total: number }>
  c?: () => Promise<{ success: boolean; msg: string }>
  u?: () => Promise<{ success: boolean; msg: string }>
  d?: () => Promise<{ success: boolean; msg: string }>
}
export type OperaBtnKeys =
  | 'modalCancelBtn'
  | 'modalConfirmBtn'
  | 'tableActionBtns'
  | 'drawerFooterBtns'
  | 'leftBtns'
  | 'rightBtns'
export interface BFCurdExpose<T = any> {
  showModal(): void
  hideModal(): void
  showFilter(): void
  hideFilter(): void
  setFormData(newData: T): void
  getFormData(): T
  setFilterData(newData: T): void
  getFilterData(): T
  setPageInfo(page: number, size?: number): void
  addPageBtn(pos: OperaBtnKeys, btn: BFCurdOperaBtn, index?: number): void
  updatePageBtn(pos: OperaBtnKeys, index: number, btn: BFCurdOperaBtn): void
  deletePageBtn(pos: OperaBtnKeys, index: number): void
}

export type PageBtnClickData<T = any> = {
  formdata?: T
  rowData?: T
  selectKeys?: any[]
  selectRows?: T[]
}

export type PageBtnClickCallbackFn = (
  action: 'c' | 'r' | 'u' | 'd',
  data?: any
) => Promise<'hideModal' | void>

/**
 * 初始化props
 */
export const initColumns = (tablePorps: BFTableProps, slots: any) => {
  let hasAction = false
  tablePorps.columns.forEach((item: any) => {
    if (item.slot && item.key != 'action') {
      item.render = function (rowData: any, rowIndex: number) {
        return h('div', slots[item.key]!({ rowData, rowIndex }))
      }
    }
    if (item.key === 'action') {
      hasAction = true
    }
  })
  if (!hasAction) {
    // eslint-disable-next-line vue/no-mutating-props
    tablePorps.columns.push({ title: '操作', key: 'action', fixed: 'right', slot: true })
  }
}

/**
 * 创建页面响应式数据
 * @param tableProps
 * @returns
 */
export const createState = (tableProps: BFTableProps) => {
  return reactive({
    page: 1,
    size: 20,
    total: 0,
    currentBtn: null as unknown as BFCurdOperaBtn,
    tableData: [] as any[],
    tableLoading: false,
    formdata: {},
    filterData: {},
    selectRowKeys: tableProps.selectRowKeys || [],
    selceRows: tableProps.selectRows || []
  })
}

/**
 * modal框
 * @returns
 */
export const useModal = () => {
  const modalVisible = ref(false)
  const showModal = () => {
    modalVisible.value = true
  }
  const hideModal = () => {
    modalVisible.value = false
  }
  return { showModal, hideModal, modalVisible }
}

/**
 * 筛选框
 * @returns
 */
export const useFilter = () => {
  const filterVisible = ref(false)
  const showFilter = () => {
    filterVisible.value = true
  }
  const hideFilter = () => {
    filterVisible.value = false
  }
  return { showFilter, hideFilter, filterVisible }
}
/**
 * 显示信息
 * @param success
 * @param msg
 * @param callBack
 * @returns
 */
export const showInfo = (success: boolean, msg: string, callBack?: Function) => {
  if (success) {
    window.$msg.success(msg)
    callBack && callBack()
    return 'hideModal'
  } else {
    window.$msg.error(msg)
  }
}

export const getDefaultBFCurdBtns = (): {
  toolRow?: BFCurdOperaBtn[]
  modalConfirm?: BFCurdOperaBtn
  modalCancel?: BFCurdOperaBtn
  tableActionColumn?: BFCurdOperaBtn[]
  drawerFooter?: BFCurdOperaBtn[]
} => {
  return {
    toolRow: [
      { text: '新增', opera: 'add', pos: 'left', btnProps: { type: 'primary' } },
      { text: '批量删除', opera: 'bulk-delete', pos: 'left', btnProps: { type: 'error' } },
      { text: '筛选', opera: 'filter', pos: 'left', btnProps: { type: 'tertiary' } },
      { text: '导出', opera: 'export', pos: 'right', btnProps: { type: 'success' } }
    ],
    modalConfirm: {
      text: '确定',
      opera: 'confirm',
      btnProps: { type: 'error' }
    },
    modalCancel: {
      text: '取消',
      opera: 'cancle',
      btnProps: { type: 'error' }
    },
    tableActionColumn: [
      {
        text: '编辑',
        opera: 'edit',
        btnProps: { type: 'info', size: 'small' },
        show() {
          return true
        }
      },
      {
        text: '删除',
        opera: 'delete',
        btnProps: { type: 'error', size: 'small' },
        show() {
          return true
        }
      }
    ],
    drawerFooter: [
      { text: '搜索', opera: 'search', btnProps: { type: 'primary' } },
      { text: '重置', opera: 'reset', btnProps: {} }
    ]
  }
}
